// Library
import Vue from 'vue'
import VueStorage from 'vue-ls'

import router from '@/router'
import i18n from '@/local'
import store from '@/store'

import { VueAxios } from '@/utils/request'
import { appSetting, themeSetting, storageOption } from '@/setting/app-setting'
import { themeConst } from '@/constant'

// Vue UI Framework
import Antd from 'ant-design-vue'
import 'ant-design-vue/dist/antd.less'
import Viser from 'viser-vue'
import VueClipboard from 'vue-clipboard2'

import '@/filter/filter' // base filter
import '@/router/router-guard' // router control

// views
import './App.less'
import App from '@/App.vue'

VueClipboard.config.autoSetContainer = true
Vue.config.productionTip = false

Vue.use(VueStorage, storageOption)
Vue.use(Antd)
Vue.use(VueAxios, router)
Vue.use(Viser)
Vue.use(VueClipboard)

new Vue(
  {
    router: router,
    i18n: i18n,
    store: store,
    mounted () {
      // theme
      store.commit('TOGGLE_THEME', Vue.ls.get(themeConst.DEFAULT_THEME, themeSetting.navTheme))

      store.commit('TOGGLE_COLOR', Vue.ls.get(themeConst.DEFAULT_COLOR, themeSetting.color))

      store.commit('TOGGLE_COLOR_WEAK', Vue.ls.get(themeConst.DEFAULT_COLOR_WEAK, themeSetting.colorWeak))

      store.commit('TOGGLE_LAYOUT', Vue.ls.get(themeConst.DEFAULT_LAYOUT, themeSetting.layout))

      store.commit('TOGGLE_CONTENT_WIDTH', Vue.ls.get(themeConst.DEFAULT_CONTENT_WIDTH_TYPE, themeSetting.contentWidth))

      store.commit('SET_SIDEBAR_TYPE', Vue.ls.get(themeConst.SIDEBAR_TYPE, true))

      store.commit('TOGGLE_FIXED_SIDEBAR', Vue.ls.get(themeConst.DEFAULT_FIXED_SIDEBAR, themeSetting.fixSidebar))

      store.commit('TOGGLE_FIXED_HEADER', Vue.ls.get(themeConst.DEFAULT_FIXED_HEADER, themeSetting.fixedHeader))

      store.commit('TOGGLE_FIXED_HEADER_HIDDEN', Vue.ls.get(themeConst.DEFAULT_FIXED_HEADER_HIDDEN, themeSetting.autoHideHeader))

      // token
      store.commit('SET_TOKEN', Vue.ls.get(appSetting.token_key))
    },
    render: h => h(App)
  }
).$mount('#app')
